

<el-dialog id="form" v-loading="loading" :close-on-click-modal="false" v-cloak title="日程安排" :visible.sync="dialogVisible" width="50%">
    <el-form ref="form" :model="form" :rules="rules" label-width="120px" label-position="right" size="small">
            <!--领导人-->
	        <el-form-item  label="领导人" prop="leader">
	            <el-input
                        v-model="form.leader"
                         :disabled="false"
                          :readonly="false"
                          :style="{width:  '100%'}"
                          :clearable="true"
                        placeholder="请输入领导人">
                </el-input>
	        </el-form-item>   
        <!--安排内容-->	
	        <el-form-item  label="安排内容" prop="content">
	            <el-input
                        type="textarea" :rows="5"
                        :disabled="false"
                        :readonly="false"
                        v-model="form.content"
                        :style="{width: '100%'}"
                        placeholder="请输入安排内容">
                </el-input>
	        </el-form-item>
	   
        <!--安排时间-->
    
        <el-form-item  label="安排时间" prop="arrangeTime">
                <el-date-picker
                     v-model="form.arrangeTime"
placeholder="请选择安排时间"                    :readonly="false"
                    :disabled="false"
                    :editable="false"
                    :clearable="true"
                    format="yyyy-MM-dd hh-mm-ss"
                    value-format="yyyy-MM-dd hh-mm-ss"
                    :style="{width:'100%'}"
                    type="datetime">
            </el-date-picker>
        </el-form-item>
   
        <!--状态-->
    
        <el-form-item  label="状态" prop="arrangeStatus">
                    <el-select v-model="form.arrangeStatus"
                               @visible-change="arrangeStatusOptionsGet"
                               :style="{width: '100%'}"
                               :filterable="false"
                               :disabled="false"
                               :multiple="false" :clearable="true"
                              placeholder="请选择状态">
                        <el-option v-for='item in arrangeStatusOptions' :key="item.dictValue" :value="item.dictValue"
                                   :label="item.dictLabel"></el-option>
                    </el-select>
        </el-form-item>
   
    </el-form>
    <div slot="footer">
        <el-button size="mini" @click="dialogVisible = false">取消</el-button>
        <el-button size="mini" type="primary" @click="save()" :loading="saveDisabled">保存</el-button>
    </div>
</el-dialog>
<script>
    var form = new Vue({
        el: '#form',
        data:function() {
            return {
                loading:false,
                saveDisabled: false,
                dialogVisible:false,
                // 状态
                arrangeStatusOptions:[],
                //表单数据
                form: {
                    // 领导人
                    leader:'',
                    // 安排内容
                    content:'',
                    //安排时间
                    arrangeTime:"",
                    // 状态
                    arrangeStatus:"",

                },
                rules:{
                        // 领导人
                        leader: [{"required":true,"message":"领导人不能为空"},{"min":0,"max":255,"message":"领导人长度必须为0-255"}],
                        // 安排内容
                        content: [{"required":true,"message":"安排内容不能为空"}],
                        // 安排时间
                        arrangeTime: [{"required":true,"message":"请选择安排时间"}],
                        // 状态
                        arrangeStatus: [{"required":true,"message":"请选择状态"}],

                },

            }
        },
        watch:{
               

            dialogVisible:function (v) {
                if(!v){
                    this.$refs.form.id=null;
                    this.$refs.form.resetFields();
                }
            }
        },
        components:{
        },
        computed:{
        },
        methods: {

            open:function(id){
                if (id) {
                    this.get(id);
                }
                this.$nextTick(function () {
                    this.dialogVisible = true;

                })
            },
            save:function() {
                var that = this;
                var url = ms.manager + "/cmsMessage/cmsSchedule/save.do"
                if (that.form.id > 0) {
                    url = ms.manager + "/cmsMessage/cmsSchedule/update.do";
                }
                this.$refs.form.validate(function(valid) {
                    if (valid) {
                        that.saveDisabled = true;
                        var form = JSON.parse(JSON.stringify(that.form));
                        ms.http.post(url, form).then(function (res) {
                            if (res.result) {
                                that.$notify({
                                    title: "成功",
                                    message: "保存成功",
                                    type: 'success'
                                });
                                that.dialogVisible = false;
                                indexVue.list();
                            } else {
                                that.$notify({
                                    title: "错误",
                                    message: res.msg,
                                    type: 'warning'
                                });
                            }

                            that.saveDisabled = false;
                        }).catch(function (err) {
                            console.err(err);
                            that.saveDisabled = false;
                        });
                    } else {
                        return false;
                    }
                })
            },

            //获取当前日程安排
            get:function(id) {
                var that = this;
                this.loading = true
                ms.http.get(ms.manager + "/cmsMessage/cmsSchedule/get.do", {"id":id}).then(function (res) {
                    that.loading = false
                    if(res.result&&res.data) {
                   
                        that.form = res.data;
                    }
                });
            },
                   //状态  列表格式化
		arrangeStatusFormat:function(row, column, cellValue, index){
			var value="";
                        
			if(cellValue){
				var data = this.arrangeStatusOptions.find(function(value){
					return value.dictValue==cellValue;
				})
				if(data&&data.dictLabel){
					value = data.dictLabel;
				}
			}

			return value;
		},

		//获取arrangeStatus数据源
		arrangeStatusOptionsGet:function() {
                    var that = this;
                    ms.http.get(ms.base+'/mdiy/dict/list.do', {dictType:'日程安排状态',pageSize:99999}).then(function (res) {
                        that.arrangeStatusOptions = res.data.rows;
                    }).catch(function (err) {
                        console.log(err);
                    });
                },


        },
        created:function() {
            var that = this;
//加载状态 数据
                this.arrangeStatusOptionsGet();
        }
    });

</script>